<template>
	<view class="login">
		<view class="content">
			<view class="loginBtn" @tap="goPasswordLogin">登录</view>
			<view class="regiestBtn" @tap="goRegiestPage">注册</view>
			<view class="otherLogin">第三方账号登录</view>
			<view class="otherImg">
				<image src="../../static/img/weixin.png" @tap="weixinLogin"></image>
				<image src="../../static/img/qq.png" @tap="QQLogin"></image>
			</view>
			<view class="rule"> 
			    注册表示同意<text>隐私协议</text>和<text>隐私条款</text>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				
			}
		},
		created (){
			
		},
		methods: {
			goPasswordLogin(){
				uni.navigateTo({
					url:'/pages/passwordLogin/passwordLogin'
				})
			},
			goRegiestPage (){
				uni.navigateTo({
					url:'../regiest/regiest'
				})
			},
			weixinLogin (){
				uni.showToast({
					title:'微信',
					icon:'none'
				})
				uni.login({
				  provider: 'weixin',
				  success: function (loginRes) {
				    console.log(loginRes.authResult);
				  }
				});
			},
			QQLogin (){
				uni.showToast({
					title:'QQ',
					icon:'none'
				})
				uni.login({
				  provider: 'qq',
				  success: function (loginRes) {
				    console.log(loginRes.authResult);
				  }
				});
			}
			
		}
	}
</script>

<style lang="less" scoped>
	.login{
		width: 100%;
		height: 100%;
		position: absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		background-image: url(../../static/img/login.png);
		background-repeat: no-repeat;
		background-size: cover;
		.content{
			margin-top:694rpx;
			text-align: center;
			.loginBtn{
				width: 86%;
				height: 88rpx;
				line-height: 88rpx;
			     text-align: center;
				 color:#fff;
				 background-color:#ED2C61 ;
				 margin: 0 auto;
				 font-size: 32rpx;
				 letter-spacing: 1px;
			}
			.regiestBtn{
				width: 86%;
				height: 88rpx;
				line-height: 88rpx;
			     text-align: center;
				 color:#333;
				 background-color:#FFFFFF ;
				 margin: 0 auto;
				  font-size: 32rpx;
				  opacity:0.2;
				  margin-top:30rpx;
				  letter-spacing: 1px;
			}
			.otherLogin{
				margin-top:60rpx;
				font-size:28rpx;
				font-family:PingFang SC;
				font-weight:400;
				color:#999;

			}
			.otherImg{
				display: flex;
				justify-content: center;
				align-items: center;
				padding:15rpx;
				box-sizing: border-box;
				margin-top: 25rpx;
				image{
					width: 84rpx;
					height: 84rpx;
					border-radius: 50%;
					overflow: hidden;
					&:nth-child(1){
						margin-right: 90rpx;
					}
				}
			}
			.rule{
				font-size:26rpx;
				font-family:PingFang SC;
				font-weight:400;
				color:#999999;
				margin-top:25rpx;
				letter-spacing: 1px;
				text{
					color:#E8E8E8;
				}
			}
		}
	}
</style>
